<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">

<!-- 查询无结果模块 -->
<div th:fragment="empty">
	<br></br>
	<div>
		<p
			style="font-weight: bold; color: #169BD5; text-align: center; height: 30px; line-height: 30px; font-size: 22px">查无此数据</p>
	</div>
</div>

<div th:fragment="error">
	<script type="text/javascript" th:inline="javascript">
		window.parent.location.href = "error"
	</script>
</div>

<div th:fragment="login">
	<div th:text="${data}?:'未知错误'">提示信息</div>
	<script type="text/javascript" th:inline="javascript">
		setTimeout(function(){
			var djs = 3;
			swal([[${data}?:'未知错误']],djs+"秒后跳转", "error");
			$(".confirm").remove();
			var interval = setInterval(function(){
				djs--;
				$(".showSweetAlert>p").text(djs+'秒后跳转');
				if(djs == 0){
					clearInterval(interval);
					window.location.href = "login";
				} 
			}, 1000)
		},0);
	</script>
</div>

<!-- 统计页面模块 -->
<div th:fragment="statistics">
	<p
		style="font-weight: bold; color: #169BD5; text-align: center; height: 30px; line-height: 30px; font-size: 22px">用户列表</p>
	<div id="statisticsVal">
		<div>
			<table id="table">
				<tr>
					<th>用户名</th>
					<th>真实姓名</th>
				</tr>
				<tr th:each="user:${data.data}">
					<td th:text="${user.username}">admin</td>
					<td th:text="${user.truename}">李四</td>
				</tr>
			</table>
		</div>
	</div>
</div>

<div th:fragment="user_info">
	<div th:with="user=${data.data}">
		<table cellspacing="1" cellpadding="0"><tbody cellspacing="1" cellpadding="0" style="padding:0;margin:0;width:100%">
			 <tr><td>用户名称</td><td th:text="${user.username}">result.data.username</td></tr>
			 <tr><td>实名信息</td><td th:text="${user.truename}">result.data.truename</td></tr>
			 <tr><td>绑定手机</td><td th:text="${user.mobile}">result.data.mobile</td></tr>
			 <tr><td>用户权限</td><td>管理员</td></tr>
			 <tr><td>剩余流量</td><td>1.2G</td></tr>
			 <tr><td>在线时间</td><td>1分58秒</td></tr>
			 </tbody>
		</table>
	</div>
</div>

<!-- 用户编辑页面模块 -->
<div th:fragment="user_edit">
	<div id="editUserVal" th:with="user=${data.data}"  th:name="${data.data.id}" >
		<p>
			用户名：<input type="text" id="editUsername" disabled="disabled"
				style="background: #ddd;" th:value="${user.username}" />
		</p>
		<p>
			实　名：<input type="text" id="editTruename" disabled="disabled"
				  style="background: #ddd;" th:value="${user.truename}" />
		</p>
		<p>
			手机号：<input type="tel" id="editUserPhone" maxlength="11"
				disabled="disabled" style="background: #ddd;"  th:value="${user.mobile}" />
		</p>
		<p>
			密　码：<input type="password" id="editUserPsw"  th:value="${user.password}"/>
		</p>
	</div>
	</div>
</div>

<!-- 用户订单模块 -->
<div th:fragment="user_orders">
	<p style="font-weight: bold; color: #169BD5; text-align: center; height: 30px; line-height: 30px; font-size: 22px"
		th:text="#{user.orders}">用户订单</p>
	<div id="userOrders">
		<div>
			<table th:each="order:${orders}">
				<tr>
					<td>续费状态</td>
					<td th:text="${order.status}==1? '成功':'失败'">李四</td>
				</tr>
				<tr>
					<td>续费时间</td>
					<td th:text="${#calendars.format(order.time)}">2999-2-29
						23:59:59</td>
				</tr>
				<br></br>
			</table>
		</div>
	</div>
</div>



<!-- 标签页面模块 -->
<div th:fragment="lables" th:with="page=${data.data}">
	<div id="lableNumDiv">
		标签总数：<span id="lableNum" th:text="${page.totalCount}">100</span>
		<ul id="page" class="pagingUl">
<!-- 			<!-- 首页 -->
<!-- 			<li th:unless="${page.indexPage eq 1}"><a -->
<!-- 				th:onclick="'getPage(1)'" class="prv fr" -->
<!-- 				aria-label="Previous"> <span aria-hidden="true"><<</span> -->
<!-- 			</a></li> -->
			<!-- 上一页 -->
			<li th:unless="${page.indexPage eq 1}"><a
				th:onclick="'getPage('+${page.indexPage-1}+')'" class="prv fr"
				aria-label="Previous"><span aria-hidden="true"><</span>
			</a></li>
			<!-- 中间页 -->
			<li
				th:each="i : ${#numbers.sequence((page.totalCount gt 5 and page.indexPage gt 2) ? page.indexPage-2 : 1,
		    					 (page.totalPage gt 5 and page.indexPage le page.totalPage-2) ? page.indexPage+2 : page.totalPage)}"
				th:classappend="${page.indexPage eq i} ? 'activp' : 'red'"><a
				th:onclick="'getPage('+${i}+')'"> <span data-th-text="${i}"></span>
			</a></li>

			<!-- 下一页 -->
			<li th:unless="${page.indexPage eq page.totalPage}"><a
				th:onclick="'getPage('+${page.indexPage + 1 }+')'" class="next fr"
				aria-label="Next"><span aria-hidden="true">></span>
			</a></li>
			<!-- 末页 -->
<!-- 			<li th:unless="${page.indexPage eq page.totalPage}"><a -->
<!-- 				th:onclick="'getPage(5)'" class="next fr" -->
<!-- 				aria-label="Next"> <span aria-hidden="true">>></span> -->
<!-- 			</a></li> -->
		</ul>
	</div>
	<div id="lableList" th:each="item : ${data.data.list}">
		<a th:id="${'a_'+item.id}" th:href="'details.html?sign='+${item.id}"
			class="tagList">
			<table cellspacing="1" cellpadding="0">
				<tbody cellspacing="1" cellpadding="0"
					style="padding: 0; margin: 0; width: 100%">
					<tr>
						<td colspan="4">编号<span th:id="${'lableSn_'+item.id}"
							th:text="${item.sn}">items[i].sn</span></td>
					</tr>
					<tr>
						<td>路由ID</td>
						<td th:id="${'lableRouter_'+item.id}" th:text="${item.serviceSn}">routerId</td>
						<td>备注</td>
						<td th:id="${'lableTile_'+item.id}" th:text="${item.title}">items[i].title</td>
					</tr>
					<tr>
						<td>温度</td>
						<td th:id="${'lableTemp_'+item.id}" th:text="${item.tagValue.temp+'℃'}">items[i].tagValue.temp</td>
						<td>湿度</td>
						<td th:id="${'lableHum_'+item.id}" th:text="${item.tagValue.hum+'%'}">parseInt(items[i].tagValue.hum)</td>
					</tr>
					<tr>
						<td>电量</td>
						<td th:id="${'lablebattery_'+item.id}"
							th:text="${item.tagValue.battery+'%'}">items[i].tagValue.battery</td>
						<td>区域</td>
						<td th:id="${'lableZone_'+item.id}" th:text="${item.zoneName}">items[i].zoneName</td>
					</tr>
					<tr >
						<td colspan="4" th:id="${'lastUpdataTime_'+item.id}"
							th:text="${'上报时间:'+ item.updatetime != '' && item.updatetime.length() > 2 ? #strings.substring(item.updatetime,0,item.updatetime.length()-2) : '未获取'}">上报时间:updatetime</td>
					</tr>
				</tbody>
			</table>
		</a>
	</div>
	<div id="myWhite"
		style="height: 80px; width: 100%; background: transparent"></div>
</div>

<div th:fragment="lableDetails">
<div id="lableDetailsVal" th:with="lable=${data.data}">
		<table cellspacing="1" cellpadding="0">
			<tbody cellspacing="1" cellpadding="0" style="padding:0;margin:0;width:100%">
				<tr>
					<td>标签编号</td>
					<td th:text="${lable.sn}">lableSn</td>
				</tr>
				<tr>
					<td>路由ID</td>
					<td class="routerId" th:text="${lable.serviceSn?: '未获取'}">routerId</td>
				</tr>
				<tr>
					<td>监测区域</td>
					<td th:text="${lable.zoneName?:'未获取'}">result.data[0].zoneName</td>
				</tr>
				<tr>
					<td>备注名称</td>
					<td th:text="${lable.title?:'未获取'}">result.data[0].title</td>
				</tr>
				<tr>
					<td>温度阀值</td>
					<td>
						<span th:each="item:${lable.tempAlert}">
							<span th:if="${not #strings.isEmpty(item)}" th:text="${item+'℃'}">tempAlert</span>
						</span>
					</td>
				</tr>
				<tr>
					<td>湿度阀值</td>
					<td >
						<span th:each="item:${lable.humAlert}">
							<span th:if="${not #strings.isEmpty(item)}" th:text="${item+'℃'}">humAlert</span>
						</span>
					</td>
				</tr>
				<tr th:with="tag=${#objects.nullSafe(lable.tagValue,0)}">
					<td>实时温度</td>
					<td th:text="${tag != 0 ? tag.temp: '未获取'}">result.data[0].tagValue.temp ℃</td>
				</tr>
				<tr th:with="tag=${#objects.nullSafe(lable.tagValue,0)}">
					<td>实时湿度</td>
					<td th:text="${tag != 0 ? tag.hum: '未获取'}">result.data[0].tagValue.hum %</td>
				</tr>
				<tr th:with="tag=${#objects.nullSafe(lable.tagValue,0)}">
					<td>实时电量</td>
					<td th:text="${ tag != 0 ? tag.battery : '未获取'}">result.data[0].tagValue.battery %</td>
				</tr>
				<tr th:with="tag=${#objects.nullSafe(lable.tagValue,0)}">
					<td>标签状态</td>
					<div th:switch="${tag!=0 ? tag.status : -1}">
							<td th:case="0">正常</td>
							<td th:case="1">温度异常</td>
							<td th:case="2">湿度异常</td>
							<td th:case="3">温度湿度异常</td>
							<td th:case="*">未知</td>
					</div>
				</tr>
			</tbody>
		</table>
	</div>
</div>

<!-- 路由页面模块 -->
<div th:fragment="routers">
	<div th:each="router:${data.data}" id="routerList">
		<a th:href="'routerDetails.html?sign='+ ${router.id}" class="tagList">
			<table cellspacing="1" cellpadding="0">
				<tbody cellspacing="1" cellpadding="0"
					style="padding: 0; margin: 0; width: 100%">
					<tr>
						<td>编号</td>
						<td th:text="${router.sn}">result.data[i].sn</td>
					</tr>
					<tr>
						<td>备注</td>
						<td th:text="${router.title}">result.data[i].title</td>
					</tr>
					<tr>
						<td>电量</td>
						<td th:text="${router.battery}">result.data[i].battery%</td>
					</tr>
					<tr>
						<td>状态</td>
						<td th:text="${router.status eq 1 ? '在线':'离线'}">type</td>
					</tr>
				</tbody>
			</table>
		</a>
	</div>
	<div id="myWhite"
		style="height: 80px; width: 100%; background: transparent"></div>
</div>

<!-- 路由详情模块 -->
<div th:fragment="routerDetails">
	<div th:each="router:${data.data}" id="routerDetailsVal">
		<table id="routerTable" name="${router.id}" cellspacing="1" cellpadding="0">
			<tbody cellspacing="1" cellpadding="0" style="padding: 0; margin: 0; width: 100%">
				<tr>
					<td>编号</td>
					<td class="routerSn" th:text="${router.sn}">routerSn</td>
				</tr>
				<tr>
					<td>备注</td>
					<td th:text="${router.title}" id="routerTitle">result.data[0].title</td>
				</tr>
				<tr>
					<td>电量</td>
					<td th:text="${router.battery+'%'}">battery</td>
				</tr>
				<tr>
					<td>供电方式</td>
					<div th:switch="${router.supply}">
						<td th:case="1">电源</td>
						<td th:case="2">适配器</td>
						<td th:case="*">未知</td>
					</div>
				</tr>
				<tr>
					<td>SIM卡号</td>
					<td>1064890069301</td>
				</tr>
			</tbody>
		</table>
	</div>
</div>

<!-- 路由设置模块 -->
<div th:fragment="setting">
   <div id="settingLableVal" th:each="config:${data.data}">
   		<p style="text-align: center;">路由编号:<span id="awakenSn" th:text="${config.boxId}"></span></p>
		<p>
			<span class="settingName">标签唤醒周期</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.wakeup_time?:''}" id="awakenLable"/>秒 -->
			<select id="awakenLable">
				<option value="2">30S</option>
				<option value="4" selected = "selected" >1min</option>
				<option value="20">5min</option>
				<option value="60">15min</option>
				<option value="120">30min</option>
			</select>
		</p>
		<p>
			<span class="settingName">数据上报周期</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.dat_report_time?:''}" id="reportData"/>秒 -->
			<input max="255" min="0" type="number" disabled="true" value="0" id="reportData"/>秒
		</p>
		<p>
			<span class="settingName">GPS上报周期</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.gps_report_time?:''}" id="reportGPS"/>秒 -->
			<input max="255" min="0" type="number" disabled="true" value="0" id="reportGPS"/>秒
		</p>
		<p class="serviceState">
			<span class="settingName">服务状态查询</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.service_status?:''}" id="serviceState"/>秒 -->
			<span style="font-size: 1.4rem">能:</span><input type="radio" name="serviceState" value="0" disabled="true">
			<span style="font-size: 1.4rem">不能:</span><input type="radio" name="serviceState" value="1" checked="checked" disabled="true">
		</p>
		<p class="alert_1">
			<span class="settingName">灯光警报</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.alarm_time1?:''}" id="alert_1"/>秒 -->
			<span style="font-size: 1.4rem">能:</span><input type="radio" name="alert_1" value="0"  checked="checked">
			<span style="font-size: 1.4rem">不能:</span><input type="radio" name="alert_1" value="1">
		</p>
		<p class="alert_2">
			<span class="settingName">声音警报</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.alarm_time2?:''}" id="alert_2"/>秒 -->
			<span style="font-size: 1.4rem">能:</span><input type="radio" name="alert_2" value="0"  checked="checked">
			<span style="font-size: 1.4rem">不能:</span><input type="radio" name="alert_2" value="1">
		</p>
		<p>
			<span class="settingName">报警间隔</span>
<!-- 			<input maxlength="4" type="number" th:value="${config.alarm_time?:''}" id="alertInterval"/>秒 -->
			<select id="alertInterval">
				<option value="15">15min</option>
				<option value="30" selected = "selected" >30min</option>
				<option value="60">1h</option>
				<option value="120">2h</option>
				<option value="180">3h</option>
				<option value="240">4h</option>
			</select>
		</p>
    	<p>
    		<span class="settingName">路由备注</span>
    		<input type="text" id="routerTitleInput"/>
   		</p>
    </div>
</div>
<div th:fragment="lableNew">
	<div id="addLable" >
		<div id="addLableVal">
			<p>标签编号：<input type="text" id="addLableSn"/></p>
		  	<p>备注名称：<input type="text" id="addLableName"/></p>
			<p>监测区域：<input type="text" id="addLableRegoin"/></p>
		      <!--  <p>介&nbsp;&nbsp;绍：<input type="text" id="addLableContent"></p> -->
			<p>温度阀值：<input type="number" id="AddTempMin"/>--<input type="number" id="AddTempMax"/></p>
		   	<p>湿度阀值：<input type="number" id="AddHumMin"/>--<input type="number" id="AddHumMax"/></p>
		    <div id="addLableBtnDiv">
		    	<div id="scanQRCode">
		    		<img th:src="@{/resources/images/scan.jpg}"/>
		    	</div>
		        <div style="height:80px;width:100%;box-sizing:border-box"></div>
			</div>
		</div>
	</div>
</div>


</html>
